import React,{ useState} from 'react';
import { Condiv1,Condiv3 } from './PubStyled'
import Step from './Stepper'
import Timeshow from './Timer'


const Publishcont = () => {
    let obj ={
        bool:false,
        toast:false,
    }
    let [ state,setState ] =useState(obj)
    return (
        <div>
            <>
                <Condiv1>
                    <h2>布置班级</h2>
                    <p>一年级1班 <span>预计5分钟</span></p>
                </Condiv1>
                <Timeshow></Timeshow>
                <Condiv3>
                    <p>
                        <span 
                            className='yo-ico' 
                            onClick={ ()=>setState({bool:!state.bool}) } 
                            style={{color: (  state.bool ? '#308BFE' :'#ccc' )} }
                        >&#xe64d;</span>
                        <i>给每个班奖励学豆:<em 
                            className='yo-ico'
                            onClick={ ()=> setState({ toast: !state.toast,bool:state.bool})}
                        >&#xe682;</em></i>
                    </p>
                    <Step></Step>
                    {
                      state.toast &&<h3>学豆作为班级奖励，可兑换篮球，足球，羽毛球，平平球，笔记本，等学习用品和体育用品。</h3>
                    }
                </Condiv3>

            </>
        </div>
    );
}

export default Publishcont;







